<!--
Date: 2025-08-13
Copyright (c) 2025 Industrial Software Feature Database
-->
<template>
  <div class="p-3">
    <div class="flex">
      <div class="block-left">
        <el-button v-hasPermi="['standard:upload:init']" type="primary" style="width: 240px" @click="handleUploadInitData">上传初始化数据</el-button>
        <div class="tree-block">
          <el-input v-model="filterText" style="width: 240px" :suffix-icon="Search" placeholder="请输入机型或批次号" />
          <el-scrollbar class="scrollbar">
            <el-tree
              ref="treeRef"
              style="max-width: 600px"
              class="filter-tree"
              :data="data"
              node-key="id"
              :current-node-key="'0_0'"
              :props="defaultProps"
              highlight-current
              default-expand-all
              :filter-node-method="filterNode"
              @node-click="handleNodeClick"
            />
          </el-scrollbar>
        </div>
      </div>
      <div class="block-right">
        <el-form :model="paramForm" inline>
          <el-form-item prop="section" label="部段名称">
            <el-input v-model="paramForm.section" placeholder="请输入" maxlength="20"></el-input>
          </el-form-item>
          <el-form-item prop="mainSection" label="主部段">
            <el-input v-model="paramForm.mainSection" placeholder="请输入" maxlength="20"></el-input>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="handleQuery">查询</el-button>
          </el-form-item>
        </el-form>
        <el-button v-hasPermi="['standard:generate:strength']" type="primary" @click="handleGenerateStrength()">生成强度数模清单</el-button>
        <el-table v-loading="loading" :data="tableDatas" class="p-t-3" height="calc(100vh - 275px)">
          <el-table-column type="expand">
            <template #default="props">
              <div m="4">
                <el-table :data="props.row.children" @selection-change="handleSelectionChange($event, props.$index)">
                  <el-table-column type="selection" width="55" align="center"></el-table-column>
                  <el-table-column label="零件清单数据产生日期" prop="createTime" />
                  <el-table-column label="包含的零组件种类" prop="srcType" />
                  <el-table-column label="变更原因" prop="summary" />
                  <el-table-column label="清单数据来源" prop="srcDesc" />
                  <el-table-column label="强度数模清单状态" prop="status">
                    <template #default="scope">
                      <span v-if="scope.row.status === 'DONE' && scope.row.bizStep === 'SBOM_QBOM_CONVERT'" style="color: #039d12">已生成</span>
                      <span v-else style="color: #f59a23">未生成</span>
                    </template>
                  </el-table-column>
                  <el-table-column label="操作">
                    <template #default="scope">
                      <el-button v-hasPermi="['standard:part:list']" type="text" @click="handlePartList(scope.row)">零件清单</el-button>
                      <el-button
                        v-if="scope.row.status !== 'DONE' || scope.row.bizStep !== 'SBOM_QBOM_CONVERT'"
                        v-hasPermi="['standard:generate:strength']"
                        type="text"
                        @click="handleGenerateStrength(scope.row)"
                      >
                        生成强度数模清单
                      </el-button>
                    </template>
                  </el-table-column>
                </el-table>
              </div>
            </template>
          </el-table-column>
          <el-table-column prop="section" label="部段名称"></el-table-column>
          <el-table-column prop="mainSection" label="主部段"></el-table-column>
        </el-table>
        <pagination v-show="total > 0" v-model:page="paramForm.pageNum" v-model:limit="paramForm.pageSize" :total="total" @pagination="getList" />
      </div>
    </div>
    <SectionCodeSettingDialog ref="sectionCodeSettingDialogRef" @on-sure="getList" />
    <UploadInitDataDialog ref="uploadInitDataDialogRef" @on-sure="initData" />
    <PartListDialog ref="partListDialogRef" @on-sure="getList" />
  </div>
</template>

<script setup name="standardInstallationList" lang="ts">
import { Search } from '@element-plus/icons-vue';
import SectionCodeSettingDialog from './sectionCodeSettingDialog.vue';
import UploadInitDataDialog from './uploadInitDataDialog.vue';
import PartListDialog from './partListDialog.vue';
import { getTrackListV2, getStandardListV2, generateStrengthV2 } from '@/api/bomCompareTool/standardInstallationList/index';
const { proxy } = getCurrentInstance();
const filterText = ref('');
const defaultProps = {
  children: 'children',
  label: 'label'
};
interface Tree {
  [key: string]: any;
}
const multipleSelection = ref({});
const treeRef = ref();
const sectionCodeSettingDialogRef = ref();
const uploadInitDataDialogRef = ref();
const partListDialogRef = ref();
const data = ref([]);
const total = ref(0);
const paramForm = reactive({
  aircraftModel: '',
  section: '',
  mainSection: '',
  track: '',
  pageNum: 1,
  pageSize: 10
});
const tableDatas = ref([]);
const loading = ref(false);
const filterNode = (value: string, data: Tree) => {
  if (!value) return true;
  return data.label.includes(value);
};
watch(filterText, (val) => {
  treeRef.value!.filter(val);
});
const handleUploadInitData = () => {
  uploadInitDataDialogRef.value.openDialog();
};
const getList = async () => {
  const res = await getStandardListV2(paramForm);
  const groupData = res.rows.reduce((grouped, item) => {
    const key = `${item.section}-${item.mainSection}`;
    grouped[key] = grouped[key] || [];
    grouped[key].push(item);
    return grouped;
  }, {});
  tableDatas.value = [];
  for (const key in groupData) {
    const arr = key.split('-');
    const obj = {
      section: arr[0],
      mainSection: arr[1],
      children: groupData[key]
    };
    tableDatas.value.push(obj);
  }
  total.value = res.total;
};
const handleQuery = () => {
  paramForm.pageNum = 1;
  getList();
};
const initData = async () => {
  const res = await getTrackListV2();
  data.value = res.map((item, index) => {
    const obj = {
      id: index + '',
      label: item.aircraftModel,
      children: item.trackGroupInfoVos.map((el, ind) => {
        {
          return {
            id: index + '_' + ind,
            label: el.track,
            parent: item.aircraftModel
          };
        }
      })
    };
    return obj;
  });
};
const handleSelectionChange = (val, index) => {
  multipleSelection.value[index] = val;
};
const handleGenerateStrength = async (row?) => {
  let arr = [];
  for (const key in multipleSelection.value) {
    const newArr = multipleSelection.value[key];
    const newArr2 = newArr.filter((item) => item.status !== 'DONE' || item.bizStep !== 'SBOM_QBOM_CONVERT');
    if (newArr2.length) {
      arr = [...arr, newArr2[0]];
    }
  }
  if (!row && !arr.length) {
    proxy?.$modal.msgWarning('请至少选择一条数据！');
    return false;
  }
  if (row) {
    arr = [row];
  }
  const obj = {
    aircraftModel: paramForm.aircraftModel,
    track: paramForm.track,
    tableDatas: arr
  };
  sectionCodeSettingDialogRef.value.openDialog(obj);
};
const handleNodeClick = (node) => {
  if (!node.children) {
    paramForm.aircraftModel = node.parent;
    paramForm.track = node.label;
  }
  getList();
};
const handlePartList = (obj) => {
  partListDialogRef.value.openDialog(obj);
};
onMounted(async () => {
  await initData();
  paramForm.aircraftModel = data.value[0].label;
  const children = data.value[0].children;
  if (children) {
    paramForm.track = children[0].label;
  }
  getList();
});
</script>

<style lang="scss" scoped>
.block-left {
  width: 240px;
}
.tree-block {
  border: 1px solid #e4e4e4;
  margin-top: 8px;
}
.scrollbar {
  height: calc(100vh - 185px);
}
.block-right {
  padding-left: 12px;
  width: calc(100% - 250px);
}
</style>
